<template>
  <div class="container">
    <el-form :model="searchList" ref="form" size="normal">
      <el-row :gutter="20">
        <el-col :span="6" :offset="0">
          <el-select v-model="searchList.apply_batch" value-key="apply_batch" placeholder="申报日期" clearable>
            <el-option v-for="item in applyList" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </el-col>
        <el-col :span="12" :offset="0">
          <el-form-item label="">
            <el-input v-model="searchList.project_name" placeholder="项目名称" clearable></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6" :offset="0">
          <div class="right">
            <el-button type="primary" size="default" @click="search" :loading="loading">查询</el-button>
          </div>
        </el-col>
      </el-row>
    </el-form>

    <el-alert :title="titleData" type="warning" effect="light" show-icon :closable="false"></el-alert>
    <el-table :data="tableData" ref="table" border stripe :height="offsetHeight" v-loading="loading">
      <el-table-column type="selection" width="55" align="center">
      </el-table-column>
      <el-table-column prop="projectName" label="项目名称" align="center">
      </el-table-column>
      <el-table-column label="建设模式" width="100" align="center">
        <template slot-scope="{row}">
          {{row.project_model | f_buildType}}
        </template>
      </el-table-column>
      <el-table-column prop="thirdCheckAmount" label="审核金额" width="100" align="center">
      </el-table-column>
      <el-table-column label="操作" width="200" align="center">
        <template slot-scope="{row}">
          <el-button-group>
            <el-button type="primary" size="mini" @click="details(row.projectId)">详情</el-button>
            <look-pdf-item :buttonName="'审核报告'" :size="'mini'" :url="row.audit_report_url" v-if="row.audit_report_url">
            </look-pdf-item>
          </el-button-group>
        </template>
      </el-table-column>
    </el-table>

    <!-- 项目信息 -->
    <el-dialog title="项目信息" :visible.sync="projectShow" width="70%" @cancel="cancel" center :destroy-on-close="true"
      append-to-body top="0">
      <project-item :project-params="projectParams" @cancel="cancel" @init="init"></project-item>
    </el-dialog>
  </div>
</template>
<script>
import { f_buildType } from '@/utils/filters.js'
import ProjectItem from '@/components/Project'
import lookPdfItem from '@/components/Upload/LookPdf1.vue'
export default {
  name: 'UsualPastProject',
  components: {
    ProjectItem, lookPdfItem
  },
  props: {

  },
  data () {
    return {
      offsetHeight: document.documentElement.clientHeight - 400,
      titleData: '本次运维申报，每个历史项目只能复制一份。一次最多只能选中3个项目进行复制。',
      loading: false,
      searchList: {},
      applyList: [],
      tableData: [],
      projectShow: false,
      projectParams: {},
    }
  },
  created () {

  },
  mounted () {
    this.date()

  },
  methods: {
    async date () {
      const res = await this.$http('historyApply', {})
      this.applyList = res
      // 默认当前批次 -1
      const res1 = await this.$http('sysApplyDate', {})
      this.searchList = {
        apply_batch: res1.apply_batch - 1
      }
      this.init()
    },
    async init () {
      this.loading = true
      this.$refs.table.clearSelection();
      const res = await this.$http('historyList', {
        apply_batch: this.searchList.apply_batch,
        project_name: this.searchList.project_name,
        ...this.searchList
      })
      this.tableData = res
      this.loading = false
    },
    async search () {
      this.init()
      // const res = await this.$http('historyList', {})
    },
    copy () {
      let list = this.$refs.table.selection
      return list
    },
    copyCancel () {
      this.$refs.table.clearSelection()
    },
    details (id) {
      this.projectParams = {
        pid: id,
      }
      this.projectShow = true
    },
    checkReport (url) {

    },
    cancel () {
      this.projectShow = false
      this.projectParams = {}
    },
  },
  computed: {

  },
  filters: {
    f_buildType: f_buildType
  }
}
</script>
<style lang='scss' scoped>
</style>
